<template>
	<view class="smart-cotariner">
		<view class="smart-panel-title">1.容器</view>
		<view class="smart-panel-h" @click="goDetailPage('view')"><text>view 视图</text></view>
		<view class="smart-panel-h" @click="goDetailPage('scroll')"><text>scroll-view 视图</text></view>
		<view class="smart-panel-h" @click="goDetailPage('swiper')"><text>swiper可滑动视图</text></view>
		
		<view class="smart-panel-title">2.基础内容</view>
		<view class="smart-panel-h" @click="goDetailPage('text')"><text>text文本编辑</text></view>
		<view class="smart-panel-h" @click="goDetailPage('rich')"><text>rich富文本编辑</text></view>
		<view class="smart-panel-h" @click="goDetailPage('progress')"><text>progress进度条</text></view>
	</view>
	<view class="main-container">
			<!-- ... "1. 容器" 和 "2. 基础内容" 部分保持不变 ... -->
			<view class="item-obj" @click="navito('progress')">
				<text>3. progress</text>
			</view>
	
			<!-- 3. 表单组件 -->
			<view class="class-title-item">
				<text class="item-title">
					3. 表单组件
				</text>
			</view>
			
			<!-- 【添加这里】 -->
			<view class="smart-panel-h" @click="goDetailPage('button')">
				<text>1. button</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('radio')">
				<text>2. radio</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('checkbox')">
				<text>3. checkbox</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('input')">
				<text>4. input</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('picker')">
				<text>5. picker</text>
			</view>
			
			<!-- 剩下的组件先放着，但不可点 -->
			<view class="smart-panel-h" @click="goDetailPage('slider')">
				<text>6. slider</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('switch')">
				<text>7. switch</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('textarea')">
				<text>8. textarea</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('form')">
				<text>9. form</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('register')">
				<text>10. 简单注册</text>
			</view>
			<view class="smart-panel-h" @click="goDetailPage('feedback')">
				<text>11. 意见反馈</text>
			</view>
	
		</view>
		<view class="class-title-item">
					<text class="item-title">
						4. 其他组件
					</text>
				</view>
				
				<!-- 【添加这里】 -->
				<view class="smart-panel-h" @click="goDetailPage('navigator')">
					<text>1. navigator</text>
				</view>
				<view class="smart-panel-h" @click="goDetailPage('image')">
					<text>2. image</text>
				</view>
				<view class="smart-panel-h" @click="goDetailPage('video')">
					<text>3. video</text>
				</view>
				<view class="smart-panel-h" @click="goDetailPage('map')">
					<text>4. map</text>
				</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			goDetailPage(e){
				if (typeof e === 'string'){
					uni.navigateTo({
						 url:"/pages/components/"+ e +"/" +e
						
					});
				} else {
					uni.navigateTo({
						url:e.url
					});
				}
			}
		}
	}
	
</script>

<style>
.item-obj-disabled {
	/* 复制 .item-obj 的样式 */
	margin-bottom: 12px;
	background-color: #fdfdfd;
	padding: 10px;
	border-radius: 5px;
	/* ... 其他 .item-obj 样式 ... */
	
	/* 禁用效果 */
	color: #999;
	opacity: 0.6;
}
</style>
